<template>
    <view class="content">
			<view class="shopcon">
				<swiperr1 :state="4" :banner="banner"></swiperr1>
				<view class="shoptxt">
					<view>
						{{detail.name}}
					</view>
					<view>
						<span>￥</span>{{detail.money}}
					</view>
				</view>
				<view class="listcon1">
					<view class="listcon">
						<view>评价（{{detail.order_evaluate_count}})</view>
						<view @tap="jump('/subcontract/shop/evaluate?id='+id)">
							<span>查看全部</span>
							<image src="/static/rzicon.png" mode="widthFix"></image>
						</view>
					</view>
				</view>
				<view class="u-content">
					<u-parse :html="detail.des" :tag-style="style"></u-parse>
				</view>
			</view>
			<view class="btnfor">
				<view class="shopimg">
					<view @tap="telephone(tel?tel:detail.tel)">
						<image src="/static/myicon8.png" mode="heightFix"></image>
						<span>客服</span>
					</view>
					<view @tap="back">
						<image src="/static/ze-shop-o1@1x.png" mode="heightFix"></image>
						<span>门店</span>
					</view>
					<view @tap="collect">
						<!-- wsiconc2.png -->
						<image :src="detail.is_collect==0?'/static/ze-star-o@1x.png':'/static/wsiconc2.png'" mode="heightFix"></image>
						<span>收藏</span>
					</view>
				</view>
				<view @tap="jump('/subcontract/shop/Confirmorder?id='+id+'&shop_id='+detail.shop_id)">立即预定</view>
			</view>
    </view>
</template>

<script>
const app = getApp();
import swiperr1 from '../../components/swipers/swipers.vue';
export default {
	components: {
		swiperr1
	},
    data() {
        return {
            id: 0,
			img_src: app.globalData.img_src,
			img_url: app.globalData.img_urls,
			imgoss: app.globalData.imgoss,
			banner:[],
			con: '<p>【特别说明】亲爱的用户,在您正式开始下一步上门按摩账号注销流程前,我们先为您做出如下特别说明:注销上门按摩账号后,您将无法再以此账号登录和使用柿子要吃肉的相关产品与服务上门按摩也将同时终止为该账号提供我们的高品质、多元化的产品与服务这同时也不可避免地会给您的售后维权带来不便,且上门按摩账号一旦注销完成,将无法恢复。请您在注销前慎重考虑。若您经过慎重考虑后仍执意决定注销上门按摩账号的,请您务必先行仔细阅读和充分理解本《上门按摩账号注销协议》,在同意全部内容后,按照我们的注销操作指引点击进行下一步操作,您勾选本注销协议并点击下一步注销操作的行为即视为您已经同意签署和遵守本协议全部内容(如您执意决定注销上门按摩账号的,请继续向下阅读一、您需要首先知悉的是:账号注销将会对您产生如下影响:1上门按摩账号一旦注销,您将无法登录、使用该账号(也包括无法再使用该账号作为第三方账号登录其他产品),也就是说您将无法再以此账号登录/使用/继续使用上门按摩的相关产品与服务2上门按摩账号一旦注销,您曾通过该账号登录、使用的东郊到家的产品与服务下的所有内容、信息、数据、记录将会被删除或匿名化处理,您也无法再检索、访问、获取、继续使用和找回,也无权要求我们找回(但法律法规另有规定或监管部门另有要求的除外),包括:1)该账号下的个人资料(例如:头像、昵称等)及绑定信息(例如:绑定手机号、邮箱等)</p>',
			style: {
				// 字符串的形式
				p: 'color: #333;font-size:32rpx;line-height:30px',
				span: 'font-size: 30rpx',
				img:'width:100%;height:auto'
			},
			id:'',
			detail:'',
			tel:''
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad(options) {
        var that = this;
		this.id = options.id;
		if(options.official_id){
			this.official_id = options.official_id?options.official_id:''
			uni.setStorageSync('official_id', this.official_id);
		}
		this.IndexshopDes()
		app.globalData.api.request('Index/index', {official_id:uni.getStorageSync('official_id')}, 'post', 'form').then((res) => {
			if (res.code == 0) {
				this.tel = res.data.tel
			}else{
				app.globalData.show(res.msg)
			}
		});
		console.log(location.href)
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady() {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow() {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide() {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload() {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh() {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom() {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage() {},
    methods: {
		telephone(res) {
			//console.log(res)
			uni.makePhoneCall({
				phoneNumber: res
			});
		},
		back(){
			uni.navigateBack()
		},
		collect(){
			const that =this;
			app.globalData.api.request('User/collect', {
				goods_id:this.id,
				shop_id:this.detail.shop_id,
				is_type:2
			}, 'post', 'form').then((res) => {
				if (res.code == 0) {
					var msg = this.detail.is_collect==0?'收藏成功~':'取消成功~'
					this.detail.is_collect = this.detail.is_collect==0?1:0
					app.globalData.show(msg)
				}else{
					app.globalData.show(res.msg)
				}
			});
		},
		IndexshopDes(){
			const that =this;
			app.globalData.api.request('Index/goodsDes', {id:this.id}, 'post', 'form').then((res) => {
				if (res.code == 0) {
					that.detail = res.data;
					that.banner = res.data.image_pic
				}else{
					app.globalData.show(res.msg)
				}
			});
		},
		jump(url){
			if(uni.getStorageSync('token')){
				uni.setStorageSync('paytype', 0)
				uni.navigateTo({
					url:url
				})
			}else{
				uni.setStorageSync('oneurl', location.href)
				uni.navigateTo({
					url:'/pages/login/index'
				})
			}
		}
	}
};
</script>
<style>
	.btnfor>view:nth-child(2){
		width: 400rpx;
		height: 80rpx;
		float: right;
		line-height: 80rpx;
		background: linear-gradient(87.9deg, rgba(157,102,171,1) 1.44%,rgba(118,100,177,1) 98.71%);
		line-height: 80rpx;
		text-align: center;
		border-radius: 10rpx;
		font-size: 30rpx;
		color: #fff;
	}
	.shopimg{
		width: 290rpx;
		height: 80rpx;
		display: flex;
		float: left;
	}
	.shopimg>view{
		width: auto;
		height: auto;
		display: flex;
		justify-content: center;
		flex-direction: column;
		align-items: center;
		color: rgba(16,16,16,1);
		font-size: 24rpx;
		text-align: left;
		font-family: PingFangSC-regular;
	}
	.shopimg>view:nth-child(1),.shopimg>view:nth-child(2){
		margin-right: 20px;
	}
	.shopimg>view>image{
		width: auto;
		height: 45rpx;
		margin-bottom: 5rpx;
	}
	.btnfor{
		width: 100%;
		height: 120rpx;
		position: fixed;
		left:0px;
		bottom: 0px;
		z-index: 10;
		background-color: #fff;
		padding: 20rpx 30rpx;
		box-sizing: border-box;
		border-top: 2px solid rgba(245,245,245,1);
	}
	.listcon1{
		border-top: 10rpx solid rgba(245,245,245,1);
		border-bottom: 10rpx solid rgba(245,245,245,1);
	}
	.shoptxt{
		width: 100%;
		height: auto;
		display: table;
		box-sizing: border-box;
		padding: 20rpx 24rpx;
	}
	.shoptxt>view:nth-child(1){
		color: rgba(16,16,16,1);
		font-size: 28rpx;
		text-align: left;
		font-weight: bold;
		font-family: PingFangSC-regular;
	}
	.shoptxt>view:nth-child(2){
		color: #D9688E;
		margin-top: 10px;
		font-size: 28rpx;
		text-align: left;
		font-family: PingFangSC-regular;
	}
	
	.listcon>view:nth-child(1){
		color: rgb(16,16,16);
		font-size: 28rpx;
		text-align: left;
		font-family: SourceHanSansSC-medium;
	}
	.listcon>view:nth-child(2){
		color: rgba(134,101,175,1);
		font-size: 24rpx;
		text-align: right;
		font-family: SourceHanSansSC-regular;
		margin-right: 5px;
	}
	.listcon>view:nth-child(2)>image{
		width: 22rpx;
	}
	.listcon{
		width: 100%;
		height: 115rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		box-sizing: border-box;
		padding: 0px 24rpx;
		border-radius: 20px;
		background-color: rgba(255,255,255,1);
	}
	.u-content{
		width: 100%;
		height: auto;
		box-sizing: border-box;
		padding: 20rpx;
	}
	.shopcon{
		width: 100%;
		height: auto;
		padding-bottom: 120rpx;
	}
</style>
